<script setup lang="ts">
import type {PreviewItemOfMessage} from "~/pojo/vo/PreviewItemOfMessage";

const beforeClose = (userAlias: string) => {

  showConfirmDialog({
    title: '确定删除吗？',
  })
      .then(() => {
        messageStore().removeMsg(userAlias)
        refreshItems()
        // showToast('删除逻辑执行' + userAlias)
      })
      .catch(() => {
      });

};
const items: Ref<PreviewItemOfMessage[]> = ref([])

function refreshItems(): void {
  // let tmpList: PreviewItemOfMessage[] = [];
  // for (const [key, value] of messageStore().userMap) {
  //   tmpList.push(value)
  // }
  items.value = Array.from(messageStore().userMap.values());
}

onMounted(function (): void {
  barTitleStore().setTitle('我的消息')
  refreshItems()
})
function goChat(item:PreviewItemOfMessage): void {
  item.isRead=true
  navigateTo({
    path:'/person/chat',
    query:{
      u:item.sender,
      receiveId:item.receiveId
    }
  })
}
watch(
    () => {
      return messageStore().hasNew
    },
    () => {
      refreshItems()
      messageStore().hasNew=false
    })
</script>

<template>
  <van-swipe-cell v-for="item in items" style="width: 100%;">
    <van-cell is-link arrow-direction="left" @click="goChat(item)">
      <template #title>
        <span class="custom-title">{{ item.sender }}</span>
        <van-badge v-if="!item.isRead" dot/>
      </template>
      <template #value>
        <span class="preview-text">{{ item.message }}</span>
      </template>
    </van-cell>
    <template #right>
      <van-button @click="beforeClose(item.sender)" square type="danger" text="删除该聊天"/>
    </template>
  </van-swipe-cell>
  <van-empty v-if="items.length===0" description="还没有消息哦~" />


</template>

<style scoped>
.custom-title {
  font-size: 1rem;
}

.preview-text {
  white-space: nowrap;
}

</style>